<!DOCTYPE html>
<html>
<head>
		<meta charset="utf-8">
		<title>注册界面</title>
		<link rel="stylesheet" href="css/reset.css" />
		<link rel="stylesheet" href="css/common.css" />
		<link rel="stylesheet" href="css/font-awesome.min.css" />
	</head>
	<body>
		<div class="wrap login_wrap">
			<div class="content">
				
				<div class="logo"></div>
				
				<div class="login_box">	
					
					<div class="login_form">
						<div class="login_title">
							注册
						</div>
						<form action="/user/register.do" method="post">
							
							<div class="form_text_ipt">
								<input id="username" name="username" type="text" placeholder="手机号/邮箱">
							</div>
							<div class="ececk_warning"><span>手机号/邮箱不能为空</span></div>
							<div class="form_text_ipt">
								<input id="password" name="password" type="password" placeholder="密码">
							</div>
							<div class="ececk_warning"><span>密码不能为空</span></div>
							<div class="form_text_ipt">
								<input name="repassword" type="password" placeholder="重复密码">
							</div>
							<div class="ececk_warning"><span>密码不能为空</span></div>
							<div class="form_text_ipt">
								<input name="phone" type="text" placeholder="手机号">
							</div>
							<div class="ececk_warning"><span>手机号不能为空</span></div>
							
							<div class="form_btn">
								<button type="button" onclick="javascript:window.location.href='login.html'">注册</button>
							</div>
							<div class="form_reg_btn">
								<span>已有帐号？</span><a href="login.html">马上登录</a>
							</div>
						</form>
						<div class="other_login">
							<div class="left other_left">
								<span>其它登录方式</span>
							</div>
							<div class="right other_right">
								<a href="#"><i class="fa fa-qq fa-2x"></i></a>
								<a href="#"><i class="fa fa-weixin fa-2x"></i></a>
								<a href="#"><i class="fa fa-weibo fa-2x"></i></a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<script type="text/javascript" src="js/jquery.min.js" ></script>
		<script type="text/javascript" src="js/common.js" ></script>
		<div style="text-align:center;">

</div>
	</body>

<script src="js/jquery-3.2.1.js" type="text/javascript"></script>
<!-- Bootstrap -->
<script src="js/bootstrap.min.js"></script>
<!-- Waypoints -->
<script src="js/jquery.waypoints.min.js"></script>
<!-- Carousel -->
<script src="js/owl.carousel.min.js"></script>
<!-- countTo -->
<script src="js/jquery.countTo.js"></script>
<!-- Magnific Popup -->
<script src="js/jquery.magnific-popup.min.js"></script>
<!-- Main -->
<script src="js/index.js"></script>
<script src="js/layer/layer.js" type="text/javascript"></script>
<script type="text/javascript">
	$(function () {
		$("#login").click(function () {
			if ($('#username').val() == '' || $('#repassword').val() == '') {
				layer.msg("请输入完整信息");
				return;
			}
			$.post('login.do', {
				account: $('#username').val(),
				password: $('#repassword').val()
			}, function (data) {
				if (data.code == 200) {
					layer.msg(data.msg, {icon: 1, time: 2000}, function () {
						sessionStorage.setItem("currentUser", JSON.stringify(data.currentUser));
						location.href = "index.html";
					})
				} else if (data.code == 400) {
					layer.msg(data.msg, {icon: 1, time: 2000}, function () {
						sessionStorage.setItem("currentUser", JSON.stringify(data.currentUser));
						location.href = "index.html";
					})
				} else {
					layer.msg(data.msg);
				}
			}, 'json')

		})
		var isTrue = false;
		$('#username').blur(function () {
			if ($('#username').val() != '') {
				$.getJSON('login.do', {user: $('#username').val()}, function (data) {
					if (data.code != 200) {
						isTrue = true;
						$('#div1').removeAttr('hidden');
						$('#caution').css('color', 'red');
						$('#caution').text(data.msg);
					} else {
						isTrue = false;
						$('#div1').removeAttr('hidden');
						$('#caution').css('color', 'green');
						$('#caution').text(data.msg);
					}
				})
			}
		})
		var isOk = false;
		$('#password2').blur(function () {
			if ($('#password2').val() != $('#password2').val()) {
				isOk = true;
				$('#div2').removeAttr('hidden');
				$('#cautionpwd').css('color', 'red');
				$('#cautionpwd').text('两次密码输入不一致');
			} else {
				isOk = false;
				$('#div2').attr('hidden', 'hidden');
			}
		})
		$('#register').click(function () {
			if ($('#password').val() == '' || $('#password1').val() == '' || $('#password2').val() == '') {
				layer.msg("请输入完整信息");
				return;
			}
			if (isTrue || isOk) {
				layer.msg("注册失败");
				return;
			}
			$.post('register.do', {
				account: $('#username').val(),
				password: $('#password').val(),
				phone: $('#phone').val(),
			}, function (data) {
				if (data.code == 200) {
					layer.msg(data.msg, {icon: 1, time: 2000}, function () {
						location.href = "login.html";
					})
				} else {
					layer.msg(data.msg);
				}
			}, 'json')
		})
	})

</script>
</html>
